<template>
	<view class="page">
		<custom-header title="往来单位信息" />
		<!-- #ifdef APP-PLUS -->
		<view style="height: 40px;"></view>
		<!-- #endif -->
		<u--form labelPosition="top" :model="model" ref="uForm" labelWidth="auto">
			<view class="form-panel">
				<u-form-item label="企业名称" prop="enterpriseName" borderBottom>
					<u--input v-model="model.enterpriseName" border="none" placeholder="请输入企业名称"></u--input>
				</u-form-item>
				<u-form-item label="商户类型" prop="userInfo.sex" borderBottom>
					<h-select-input-tag disabled class="w-100" v-model="model.commercialType" placeholder="请选择商户类型"
						border="none" dictName="commercial_type" />
					<u-icon slot="right" name="arrow-down" color="#0003"></u-icon>
				</u-form-item>
				<u-form-item label="企业信用代码" prop="enterpriseCreditCode" borderBottom>
					<u--input v-model="model.enterpriseCreditCode" border="none" placeholder="请输入企业信用代码"></u--input>
				</u-form-item>
				<u-form-item label="企业类型" prop="enterpriseType" borderBottom>
					<h-select-input-tag class="w-100" v-model="model.enterpriseType" placeholder="请选择企业类型" border="none"
						dictName="enterprise_type" />
					<u-icon slot="right" name="arrow-down" color="#0003"></u-icon>
				</u-form-item>
				<u-form-item label="法定代表人" prop="legalRepresentative" borderBottom>
					<u--input v-model="model.legalRepresentative" border="none" placeholder="请输入法定代表人"></u--input>
				</u-form-item>
				<u-form-item label="企业地址" prop="enterpriseAddress" borderBottom>
					<u--input v-model="model.enterpriseAddress" border="none" maxlength="100"
						placeholder="请输入企业地址"></u--input>
				</u-form-item>
				<u-form-item label="公司注册时间" prop="registerDate" borderBottom>
					<h-time-select mode="date" ref="remittanceDate" v-model="model.registerDate" placeholder="请选择公司注册时间"
						border="none" :maxDate="new Date().getTime()"></h-time-select>
					<u-icon slot="right" name="arrow-down" color="#0003"></u-icon>
				</u-form-item>
				<u-form-item label="注册资本(万)" prop="registerCapital" borderBottom>
					<u--input v-model="model.registerCapital" border="none" placeholder="请输入注册资本(万)"></u--input>
				</u-form-item>
				<u-form-item label="收款账户名称" prop="bankAccountName" borderBottom>
					<u--input v-model="model.bankAccountName" border="none" placeholder="请输入收款账户名称"></u--input>
				</u-form-item>
				<u-form-item label="开户行联行号" prop="cnapsCode" borderBottom>
					 <h-select-finance-kingdee-bank-input-popup class="w-100" suffixIcon="arrow-down" border="none"
											:suffixIconStyle="{color: 'rgba(0, 0, 0, 0.2)', fontSize: '16px'}" v-model="model.cnapsCode" placeholder="请选择开户行联行号" @change="backCnapsCode" />
					<!-- <u--input v-model="model.cnapsCode" border="none" placeholder="请选择开户行联行号"></u--input> -->
				</u-form-item>
				<u-form-item label="开户行" prop="bankName" borderBottom>
					<u--input v-model="model.bankName" disabled border="none" placeholder="请输入开户行"></u--input>
				</u-form-item>
				<u-form-item label="银行账号" prop="bankAccountNo" borderBottom>
					<u--input v-model="model.bankAccountNo" border="none" maxlength="32" placeholder="请输入银行账号"></u--input>
				</u-form-item>
				<u-form-item label="公司网址(非必填)" prop="companyWeb" borderBottom>
					<u--input v-model="model.companyWeb" border="none" placeholder="请输入公司网址(非必填)"></u--input>
				</u-form-item>
				<u-form-item label="物料大类" prop="provisionBroad" borderBottom>
					<h-dropdown class="w-100" keyName="categoryName" placeholder="请选择物料大类"
						:api="api.queryProvisionBroadList" v-model="model.provisionBroad" dataKey="result" border="none"
						@change="exportWarehouseChange" />
					<u-icon slot="right" name="arrow-down" color="#0003"></u-icon>
				</u-form-item>
				<u-form-item label="物料小类" prop="provisionSmall" borderBottom>
					<custom-select-material-small class="w-100" :muitFlag="true" :parentId="model.provisionBroad"
						v-model="model.provisionSmall" placeholder="请选择物料小类" border="none"
						@select="onSelect"></custom-select-material-small>
					<u-icon slot="right" name="arrow-down" color="#0003"></u-icon>
				</u-form-item>
				<u-form-item label="合作业务" prop="mainBussiness">
					<custom-textarea-edit class="w-100" v-model="model.mainBussiness" pageTitle="合作业务" border="none"
						maxlength="500" placeholder="请输入合作业务" @input="mainBussinessInupt($event)"
						@cancel="mainBussinessCancel($event)" />
					<u-icon slot="right" name="arrow-right" color="#0003"></u-icon>
				</u-form-item>
			</view>
			<view class="space-x-1 px-1 btn_position">
				<!-- <u-button :disabled="isSubmit" type="primary" :plain="true" text="保存" @click="onDraft"></u-button> -->
				<u-button :disabled="isSubmit" type="primary" text="保存" @click="onSubmit"></u-button>
			</view>
			<view style="height: 100rpx;"></view>
		</u--form>
	</view>
</template>

<script>
import {
	queryProvisionBroadList,
	queryProvisionSmallList
} from '@/api/purchase/ErpPurchaseCannibalizeForm'
import {
	queryByEnterpriseName,
	queryByEnterpriseCreditCode
} from '@/api/purchase/ErpPurchaseSupplier.js'
import APPTYPE from '@/config/appType.js';
export default {
	props: {},
	components: {},
	data() {
		return {
			APPTYPE: APPTYPE,
			smallList: [],
			api: {
				queryProvisionBroadList,
			},
			model: {
				commercialType: 2
			},
			isSubmit: false,
			formData: {},
			enterpriseCreditCode: null,
			onlyEnterpriseCreditCode: true,
			enterpriseName: null,
			onlyEnterpriseName: true,
		}
	},
	watch: {
		'model.provisionBroad'(val) {
			if (val) {
				this.findProvisionSmallList(val)
			}
		}
	},
	onLoad(options) {
		this.formData = JSON.parse(decodeURIComponent(options.formData)) || {};
	},
	created() {
		this.model = Object.assign({}, this.formData, this.model)
		if (this.model.enterpriseCreditCode) {
			this.enterpriseCreditCode = this.model.enterpriseCreditCode
		} else {
			this.enterpriseCreditCode = null
		}
		if (this.model.enterpriseName) {
			this.enterpriseName = this.model.enterpriseName
		} else {
			this.enterpriseName = null
		}
	},
	methods: {
		backCnapsCode(data) {
			if (data) {
				this.$set(this.model, 'bankName', data.bankBranchName)
			}
		},
		onSelect($event) {
			this.$set(this.model, 'provisionSmall', $event.id)
		},
		mainBussinessInupt(val) {
			this.$set(this.model, 'mainBussiness', val)
		},
		mainBussinessCancel(val) {
			this.$set(this.model, 'mainBussiness', val)
		},
		exportWarehouseChange(id) {
			// this.smallList = []
			this.$set(this.model, 'provisionSmall', '')
			// if (id) {
			// 	this.findProvisionSmallList(id)
			// }
			// this.$nextTick(() => {
			// 	this.$refs.provisionSmall.loadData()
			// })
		},
		findProvisionSmallList(value) {
			const parentId = value
			queryProvisionSmallList({
				parentId
			}).then((res) => {
				if (res.success) {
					const data = res.result.map((item) => {
						return {
							id: item.id,
							categoryName: item.categoryName
						}
					})
					this.smallList = [data]
				} else {
					this.$u.toast(res.message)
				}
			})
		},
		async validate() {
			var that = this
			const validFlag1 = await that.validatorEnterpriseName(that.model.enterpriseName)
			const validFlag2 = await that.validatorEnterpriseCreditCode(that.model.enterpriseCreditCode)
			return validFlag1 || validFlag2
		},
		async onSubmit() {
			const flag = await this.validate()
			if (flag) {
				return;
			}
			this.isSubmit = true;
			uni.$emit(this.APPTYPE.CONTACTUNIT, this.model);
			uni.navigateBack({
				delta: 1
			})
		},
		async validatorEnterpriseName(value, callback) {
			if (value) {
				const that = this;
				var id = 1;
				if (this.model.id) {
					id = this.model.id
				}
				await queryByEnterpriseName({ enterpriseName: value, commercialType: this.model.commercialType, id: id }).then(res => {
					if (res.success) {
						if (res.result == '0') {
							that.onlyEnterpriseName = false
						} else if (res.result == '1' && that.enterpriseName == value) {
							that.onlyEnterpriseName = false
						} else {
							that.onlyEnterpriseName = true
						}
					} else {
						that.$u.toast(res.message)
					}
				})
				if (that.onlyEnterpriseName) {
					that.$u.toast('企业名称已存在，请重新输入！')
				}
				return that.onlyEnterpriseName;
				// callback && callback()
			}
		},
		async validatorEnterpriseCreditCode(value, callback) {
			if (value) {
				const that = this;
				await queryByEnterpriseCreditCode({ enterpriseCreditCode: value, commercialType: this.model.commercialType }).then(res => {
					if (res.success) {
						if (res.result == '0') {
							that.onlyEnterpriseCreditCode = false
						} else if (res.result == '1' && that.enterpriseCreditCode == value) {
							that.onlyEnterpriseCreditCode = false
						} else {
							that.onlyEnterpriseCreditCode = true
						}
					} else {
						that.$u.toast(res.message)
					}
				})
				if (that.onlyEnterpriseCreditCode) {
					that.$u.toast('企业信用代码已存在，请重新输入！')
				}
				return that.onlyEnterpriseCreditCode;
				// callback && callback()
			}
			callback && callback()
		},
	}
}
</script>

<style scoped lang="scss">
@import url("@/assets/inputStyle.scss");

.form-panel {
	margin-top: 54px;
	padding: 20rpx 40rpx 40rpx;
	background: #fff;
}

::v-deep .u-form-item__body__left__content__label {
	font-size: 16px;
	font-weight: 400;
	color: rgba(0, 0, 0, 0.9);
}

::v-deep .u-input__content__field-wrapper__field {
	font-size: 16px !important;
	font-weight: 400;
	color: rgba(0, 0, 0, 0.5) !important;
}
</style>